<?php $this->load->view('header'); ?>
<!--MAIN-->
<!-- Page Content -->
<div class="container resetPassForm">
  <div class="row">
    <div class="col-lg-12">
        <form class="col-lg-8 col-lg-offset-2 col-xs-8 col-xs-offset-2" role="form" id="form-reset-pwd" method="POST">
        <fieldset><legend class="text-center"><span>Reset Password Form</span></legend>
        <div class="form-group">
          <div class="col-md-12 col-md-offset-2 col-sm-12 col-sm-offset-2 col-xs-12 col-xs-offset-2">
              <div class="col-md-9 mar_bot">
                <input type="password" class="form-control input-margin" id="pwd-new" name="pwd-new" placeholder="New Password" >
              </div>              
              <div id="passstrength" class="col-md-3"></div>
          </div>
        </div>

        <div class="form-group">
          <div class="col-md-12 col-md-offset-2 col-sm-12 col-sm-offset-2 col-xs-12 col-xs-offset-2">
          <div class="col-md-9 mar_bot">
            <input type="password" class="form-control input-margin" id="pwd-confirm" name="pwd-confirm" placeholder="Confirm Password">
            </div>
          </div>
        </div>
        

        <div class="form-group">
          <div class="col-md-12 col-md-offset-2 col-sm-12 col-sm-offset-2 col-xs-12 col-xs-offset-2">
          <div class="col-md-9">
              <button type="submit" id="btn-reset-pwd" value="sang" name="btn-reset-pwd" class="btn btn-lg btn-primary col-md-12 col-sm-12 col-xs-12 btn-login-facebook">Save Change</button>
              </div>
          </div>
        </div>
        </fieldset>
      </form>
    </div>
      
  </div>
</div>

<script type="text/javascript">
    // check pass streng
    $('#pwd-new').keyup(function(e) {
     var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
     var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
     var enoughRegex = new RegExp("(?=.{6,}).*", "g");
     if (false == enoughRegex.test($(this).val())) {
             $('#passstrength').html('<div class="error_pwd">More Character</div>');
     } else if (strongRegex.test($(this).val())) {
             $('#passstrength').className = 'ok';
             $('#passstrength').html('<div class="success_pwd">Strong</div>');
     } else if (mediumRegex.test($(this).val())) {
             $('#passstrength').className = 'success';
             $('#passstrength').html('<div class="success_pwd">Medium</div>');
     } else {
             $('#passstrength').className = 'error';
             $('#passstrength').html('<div class="warning_pwd">Weak</div>');
     }
     return true;
    });

    $(document).ready(function(){
        $("#form-reset-pwd").validate({
            errorElement: "span", // contain the error msg in a span tag
            errorClass: 'help-block',
            errorPlacement: function (error, element) { // render error placement for each input type
                if (element.attr("type") == "radio" || element.attr("type") == "checkbox") { // for chosen elements, need to insert the error after the chosen container
                    error.insertAfter($(element).closest('.form-group').children('div').children().last());
                } else if (element.attr("name") == "dd" || element.attr("name") == "mm" || element.attr("name") == "yyyy") {
                    error.insertAfter($(element).closest('.form-group').children('div'));
                } else {
                    error.insertAfter(element);
                    // for other inputs, just perform default behavior
                }
            },
            highlight: function (element) {
                $(element).closest('.help-block').removeClass('valid');
                // display OK icon
                $(element).closest('.form-group').removeClass('has-success').addClass('has-error has-feedback').find('.symbol').removeClass('ok').addClass('required');
                $(element).closest('.form-group').find(".glyphicon-ok").remove();
                $(element).after("<span class='glyphicon glyphicon-remove form-control-feedback'></span>");
                // add the Bootstrap error class to the control group
            },
            unhighlight: function (element) { // revert the change done by hightlight
                $(element).closest('.form-group').removeClass('has-error');
                
                // set error class to the control group
            },
            success: function (label, element) {
                label.addClass('help-block');
                // mark the current input as valid and display OK icon
                $(element).closest('.form-group').removeClass('has-error').addClass('has-success').find('.symbol').removeClass('required').addClass('ok');
                $(element).closest('.form-group').find(".glyphicon-remove").remove();
                $(element).after("<span class='glyphicon glyphicon-ok form-control-feedback'></span>");
            },
            rules: {
                "pwd-new" : {
                    required : true,
                    minlength : 8,
                    remote:{
                        type :"POST",
                        url : "<?php echo site_url('buyer/checkUserPassExists/'.$id);?>"
                    }
                },
                "pwd-confirm" : {
                    equalTo : "#pwd-new",
                    required : true,
                    minlength : 8
                }
            },
            messages: {
                "pwd-new" : {
                    required : "<?php echo $this->lang->line('Password')." ".$this->lang->line('required') ?>",
                    minlength : "<?php echo $this->lang->line('Password')." ".$this->lang->line('min_length'); ?>",
                    remote : "<?php echo $this->lang->line('Password')." ".$this->lang->line('same_pass_old'); ?>"
                },
                "pwd-confirm" :{
                    required : "<?php echo $this->lang->line('Password')." ".$this->lang->line('required') ?>",
                    minlength : "<?php echo $this->lang->line('Password')." ".$this->lang->line('min_length'); ?>",
                    equalTo : "<?php echo $this->lang->line('Confirm Password')." ".$this->lang->line('matches') ?>",
                }
            },
          submitHandler:function(form){
            form.submit();
          }
        });// end validate form
    });

</script>


<!--END OF MAIN-->
<?php $this->load->view('footer'); ?>